<template>
  <view class="page">
    <!-- 商品轮播图 -->
    <swiper class="swiper" indicator-dots autoplay circular>
      <swiper-item v-if="goodInfo.packageCoverImage">
        <image class="swiper-img" :src="goodInfo.packageCoverImage" mode="aspectFill"></image>
      </swiper-item>
	  <swiper-item v-if="goodInfo.packageDishImage1">
	    <image class="swiper-img" :src="goodInfo.packageDishImage1" mode="aspectFill"></image>
	  </swiper-item>
	  <swiper-item v-if="goodInfo.packageDishImage2">
	    <image class="swiper-img" :src="goodInfo.packageDishImage2" mode="aspectFill"></image>
	  </swiper-item>
	  <swiper-item v-if="goodInfo.packageEnvironmentImage">
	    <image class="swiper-img" :src="goodInfo.packageEnvironmentImage" mode="aspectFill"></image>
	  </swiper-item>
	  <swiper-item v-if="goodInfo.packageFamilyImage">
	    <image class="swiper-img" :src="goodInfo.packageFamilyImage" mode="aspectFill"></image>
	  </swiper-item>
    </swiper>

    <!-- 商品基本信息 -->
    <view class="goods-info">
      <view class="goods-name">{{goodInfo.name}}</view>
	  <view class="goodsMSline">
		  <view class="bqBox">
		  		  <view class="bqLine" v-if="goodInfo.share==1">分享得{{goodInfo.shareAmount}}金币</view>
		  		 <!-- <view class="bqLine">商家资质</view> -->
				  <view class="specs">商品规格：{{goodInfo.specs}}</view>
		  </view>
		  <view >
			  <image @click="unCollect" v-if="iscollect" src="/static/img/shouc.png" mode="" class="shoucImg"></image>
			  <image @click="shouchang" v-else src="/static/img/nosc.png" mode="" class="shoucImg"></image>
		  </view>
	  </view>
    
      <view class="price-section">
        <view class="price-left">
          <text class="sale-price">¥{{goodInfo.currentPrice}}</text>
          <text class="market-price">¥{{goodInfo.originalPrice}}</text>
        </view>
        <text class="stock">库存: {{goodInfo.stock}}件</text>
      </view>
    </view>

    <!-- 适用门店模块 -->
<!--    <view class="store-section" @click="goShop">
      <view class="section-title">
        <text>适用门店</text>
        <text class="store-count">(共{{shoplength}}家)</text>
      </view>
      
      <view class="store-list">
        <view class="store-item">
          <view class="store-info">
            <text class="store-name">{{shopInfo.storeName}}</text>
            <text class="store-address">{{shopInfo.areaName}}{{shopInfo.address}}</text>
          </view>
          <image 
            class="phone-icon" 
            src="/static/img/icon_phone.png" 
            mode="widthFix"
            @click.stop="callPhone(shopInfo.phone)"
          ></image>
        </view>
      </view>
    </view> -->
	
	<!-- 群聊 -->

	
	<!-- <view class="youhuiLine">
		<view class="yhTitle">金币抵扣2元</view>
		<view class="yhright">
			<checkbox-group>
				<label>
					<checkbox value="cb" :checked="true" />
				</label>
			</checkbox-group>
		</view>
	</view>
	<view class="youhuiLine">
		<view class="yhTitle">优惠券</view>
		<view class="coupon">
			<span>暂无优惠券</span>
			<image src="/static/img/icon_arrow_right.png" mode="" class="jtImg"></image>
		</view>
	</view> -->
	
	<view class="detailsBox">
		<view class="descriptionTitle">详情内容</view>
		 <rich-text :nodes="goodInfo.description" style="background: #fff;"></rich-text>
	</view>
	<view class="detailsBox">
		<view class="descriptionTitle">购买须知</view>
		 <rich-text :nodes="goodInfo.purchaseNotes" style="background: #fff;"></rich-text>
	</view>
	

	
	  
  </view>
</template>

<script>
export default {
  data() {
    return {
      goods: {
        name: '高端智能按摩椅 尊享版',
        salePrice: '5999',
        marketPrice: '8999',
        stock: 128,
        images: [
          'http://dmsphoto.66km.com.cn/thFiles/3AC6B37D-1FF5-48D5-8FAC-AE5A7312F2D2.jpg',
          'http://dmsphoto.66km.com.cn/thFiles/3AC6B37D-1FF5-48D5-8FAC-AE5A7312F2D2.jpg',
          'http://dmsphoto.66km.com.cn/thFiles/3AC6B37D-1FF5-48D5-8FAC-AE5A7312F2D2.jpg'
        ],
        availableStores: [
          {
            name: '旗舰店(人民广场店)',
            address: '上海市黄浦区人民大道100号',
            phone: '400-123-4567'
          },
          {
            name: '分店(静安寺店)',
            address: '上海市静安区南京西路1788号',
            phone: '400-123-4568'
          },
          {
            name: '分店(陆家嘴店)',
            address: '上海市浦东新区陆家嘴环路1000号',
            phone: '400-123-4569'
          }
        ]
      },
	  id:'',
	  goodInfo:'',
	  location:'',
	  shopInfo:'',
	  shoplength:0,
	  shopList:'',
	  shareShow:false,
	  userInfo:'',
	  type:1,
	  shareId:'',
	  iscollect:false,
	  scene:'',
	  bizData:'',
    }
	
  },
  onShow() {
  	
  },
  onLoad(opt){
	  this.id=opt.id;
	  this.type=opt.type;
	  this.location= uni.getStorageSync("location")
	  this.userInfo= uni.getStorageSync("userInfo")
	  if(opt.shareId){
		  this.shareId=opt.shareId
	  }
	  if(opt.scene){
	  	this.scene=opt.scene
	  }
	  //this.scene="ee9951cf673c4dabbc14bd0cc78c9369"
	  if(this.scene){
		  this.getWxQrCodeScene()
	  }else{
		  
	  }
	 
	  this.getData()
  },
  methods: {
	getWxQrCodeScene(){
		var obj={
			scene:this.scene
		}
		this.$http('jeecg-boot/app/wx/code/getWxQrCodeScene',{
				 //  key:JSON.stringify(obj),
				 scene:this.scene
		},'POST').then(res => {
				   //console.log(res)
			 var bizData=res.result.bizData
			 this.bizData=JSON.parse(bizData)
			 console.log(this.bizData)
			 this.shareId= this.bizData.userId
		 })
	},
	shouchang(){
		uni.showLoading({
			title: '加载中'
		})
		this.$http('jeecg-boot/api/wx/collect',{
				   collectId:this.id,
				 
		},'POST').then(res => {
				   //console.log(res)
			 uni.hideLoading();
			 if(res.success){
				 this.iscollect=true
			 }
			 uni.showToast({
			  title: res.message,
			  icon:'none',
			  duration: 3000
			 });
			 
		 })
	},
	unCollect(){
		uni.showLoading({
			title: '加载中'
		})
		this.$http('jeecg-boot/api/wx/unCollect',{
				   collectId:this.id,
				 
		},'POST').then(res => {
				   //console.log(res)
			 uni.hideLoading();
			 if(res.success){
				 this.iscollect=false
			 }
			 uni.showToast({
			  title: res.message,
			  icon:'none',
			  duration: 3000
			 });
			 
		 })
	},
	bargain(){
	 
	
	  uni.showLoading({
	  	title: '加载中'
	  })
	  this.$http('jeecg-boot/app/market/bicBargainDetail/bargain',{
	  		   productId:Number(this.id),
	  		   type:1,
	  		   userId:this.userInfo.id
	  },'POST').then(res => {
	  		   //console.log(res)
	  	 uni.hideLoading();
	  	 this.getData()
	  	 
	   })
	},
	getData(){
		uni.showLoading({
			title: '加载中'
		})
		this.$http('jeecg-boot/app/market/bicProduct/queryById',{
				   id:this.id,
				   startLng:this.location.lng,
				   startLat:this.location.lat,
				   userId:this.userInfo.id
		},'POST').then(res => {
				   //console.log(res)
			 uni.hideLoading();
			 this.goodInfo=res.result
			 this.iscollect=this.goodInfo.isCollect
			 if(res.result.mapVos){
				  this.shoplength=res.result.mapVos.length
				  res.result.mapVos.sort((a, b) => a.distance - b.distance);
				  if(this.shoplength){
					 this.shopInfo=res.result.mapVos[0]
					 this.shopList=res.result.mapVos
					  uni.setStorageSync('ckshop', this.shopInfo)
					  uni.setStorageSync('shopList',this.shopList )
				  }
			 }else{
				  this.shoplength=res.result.storeVos.length
				  this.shopInfo=res.result.storeVos[0]
				  this.shopList=res.result.storeVos
				   uni.setStorageSync('ckshop', this.shopInfo)
				   uni.setStorageSync('shopList',this.shopList )
			 }
			
			
			 
		 })
	},
	gowp(){
		uni.navigateTo({
			url:'wp?img='+this.goodInfo.packageCoverImage+'&name='+this.goodInfo.name+'&currentPrice='+this.goodInfo.currentPrice+'&originalPrice='+this.goodInfo.originalPrice+'&productId='+this.id
		})
	},
	goqun(){
		uni.navigateTo({
			url:'qun'
		})
	},
	zaikan(){
		var token= uni.getStorageSync("token")
		if(token){
			this.shareShow=true;
		}else{
			uni.navigateTo({
				url:'login?shareId='+this.shareId
			})
		}
		
	},
	shareShowyc(){
		this.shareShow=false;
	},
	goShop(){
		uni.setStorageSync('shopList',this.shopList )
		uni.navigateTo({
			url:'shopList'
		})
	},
    callPhone(phoneNumber) {
      uni.makePhoneCall({
        phoneNumber: phoneNumber
      })
    },
	handleBargain() {
		var token= uni.getStorageSync("token")
		if(token){
			this.bargain()
			  // 这里可以添加砍价逻辑
		}else{
			uni.navigateTo({
				url:'login?shareId='+this.shareId
			})
		}
	   
	},
	handleBuy() {
		var token= uni.getStorageSync("token")
		if(token){
			uni.navigateTo({
				url:'confirm?id='+this.id+'&shareId='+this.shareId
			})
		}else{
			uni.navigateTo({
				url:'login?shareId='+this.shareId
			})
		}
		
		
	  
	} 
},
  onShareAppMessage(res) {
  	console.log(res)
  	var img='';
  	/* if(this.mainImg){
  		img=this.mainImg
  	}else{
  		img="http://dmsphoto.66km.com.cn/thFiles/83074F71-F5C9-4C8E-B23F-2D195788960B.png"
  	} */
  	
  	var url= 'pages/index/goodsDetail?id='+this.id+'&shareId='+this.userInfo.id
  	
  	return {
  		title: this.goodInfo.name,
  		imageUrl:this.goodInfo.coverUrl,
  		//imageUrl:this.mainImg,
  		//imageUrl:'http://dmsphoto.66km.com.cn/thFiles/83074F71-F5C9-4C8E-B23F-2D195788960B.png',
  		path:url,
  		success(res){
  			uni.showToast({
  				title:'分享成功'
  			})
  		},
  		fail(res){
  			uni.showToast({
  				title:'分享失败',
  				icon:'none',
  				duration: 3000
  			})
  		}
  	}
  },
}
</script>

<style scoped>
.page {
  background-color: #f8f8f8;
  min-height: 100vh;
  padding-bottom: 40rpx;
}

/* 轮播图样式 */
.swiper {
  width: 100%;
  height: 750rpx;
}

.swiper-img {
  width: 100%;
  height: 100%;
}

/* 商品信息样式 */
.goods-info {
  background-color: #fff;
  padding: 30rpx;
  margin-bottom: 20rpx;
}

.goods-name {
  font-size: 36rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 30rpx;
}

.price-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.price-left {
  display: flex;
  align-items: baseline;
}

.sale-price {
  font-size: 44rpx;
  color: #EC0F0A;
  font-weight: bold;
  margin-right: 20rpx;
}

.market-price {
  font-size: 28rpx;
  color: #999;
  text-decoration: line-through;
}

.stock {
  font-size: 26rpx;
  color: #666;
}

/* 适用门店样式 */
.store-section {
  background-color: #fff;
  padding: 30rpx;
}

.section-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30rpx;
  font-size: 32rpx;
  color: #333;
  font-weight: bold;
  border-bottom: 1px solid #eee;
  padding-bottom: 24rpx;
}

.store-count {
  font-size: 26rpx;
  color: #999;
  font-weight: normal;
}

.store-list {
  display: flex;
  flex-direction: column;
  gap: 30rpx;
}

.store-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 30rpx;
  border-bottom: 1rpx solid #eee;
}

.store-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.store-info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.store-name {
  font-size: 34rpx;
  font-weight: 600;
  color: #333;
  margin-bottom: 10rpx;
}

.store-address {
  font-size: 26rpx;
  color: #666;
}

.phone-icon {
  width: 50rpx;
  height: 50rpx;
  margin-left: 20rpx;
}
.bqBox{
	display: flex;
}
.bqLine{
	font-size: 24rpx;color: #EC0F0A;
	border: 1px solid #EC0F0A;border-radius: 8rpx;
	margin-right: 10rpx;
	padding: 4rpx 8rpx;
}
.fixed-bottom-menu {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120rpx;
  display: flex;
  z-index: 999;
}

.left-menu {
  flex: 1;
  width: 50%;
  background-color: #FF0000; /* 红色背景 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #FFFFFF;
  font-size: 28rpx;
}

.bargain-text {
  font-size: 32rpx;
  font-weight: bold;
  margin-bottom: 8rpx;
}

.right-menu {
  flex: 1;
  width: 50%;
  background-color: #FFFACD; /* 浅黄色背景 */
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 30rpx;
  box-sizing: border-box;
}

.price-group {
  display: flex;
  flex-direction: column;
}

.current-price {
  font-size: 24rpx;
  color: #FF0000;
  font-weight: bold;
  margin-bottom: 8rpx;
}

.original-price {
  font-size: 24rpx;
  color: #999999;
  text-decoration: line-through;
}

.buy-btn {
  background-color: #FF0000;
  color: #FFFFFF;
  padding: 16rpx 40rpx;
  border-radius: 50rpx;
  font-size: 28rpx;
  font-weight: bold;
}
.detailsBox{
	margin-top: 20rpx;
	background: #fff;
   padding: 20rpx;
}
.descriptionTitle{
	font-size: 32rpx;padding-bottom: 20rpx;font-weight: 600;
}
.youhuiLine{
	display: flex;justify-content: space-between;
	margin-top: 20rpx;background: #fff;
	padding: 20rpx;
}
.jtImg{
	width: 12rpx;height: 20rpx;
	margin-top: 12rpx;
	    margin-left: 10rpx;
}
.coupon{
	display: flex;color: #999;
}
.zaikan{
	font-size: 36rpx;
}
.shareBtn{
			/* width: 100rpx; */
			background: #F4F5F7;
		}
	.shareBimg{
		width: 102rpx;
		height: 102rpx;
	}
	.bottomTxtshare{
		color: #333333;
		font-size: 22rpx;
		padding-top: 20rpx;
	}
	.shareBox{
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.5);
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 11222;
	}
	.shareCont{
		width: 100%;
		background: #F4F5F7;
		position: absolute;
		left: 0;
		bottom: 0;
		display: flex;
		justify-content: space-around;
		padding: 50rpx 0;
		border-radius: 40rpx 40rpx 0px 0px;
	}
button::after{
	 	border: none;
	}
	button{
		position: relative;
		display: block;
		margin-left: 0;
		margin-right: 0;
		padding-left: 0px;
		padding-right: 0px;
		box-sizing: border-box;
		text-align: center;
		text-decoration: none;
		line-height: 1.35;
		-webkit-tap-highlight-color: transparent;
		overflow: hidden;
		color: #000000;
		background-color: #fff;
		
		height: 100%;
		}
.qunIcon{
	width: 90rpx;height: 90rpx;
}
.qunBox{
	    background: #fff;
	    margin-top: 20rpx;
	    display: flex;
	    justify-content: space-between;
		padding: 20rpx;
}
.iconBox{
	text-align: center;font-size: 24rpx;
}
.qunMs1{
	font-size: 34rpx;
	padding-top: 20rpx;
	padding-bottom: 10rpx;
}
.qunMs2{
	font-size: 24rpx;
}
.qunBtn{
	height: 80rpx;
	background: #FF0000;
	line-height: 80rpx;
	color: #fff;
	border-radius: 16rpx;
	padding: 0 20rpx;
	font-size: 26rpx;
	margin-top: 20rpx;
}
.goodsMSline{
	display: flex;justify-content: space-between;
}
.shoucImg{
	width: 40rpx;height: 40rpx;
}
.specs{
	font-size: 26rpx;
	    color: #666;
		padding: 4rpx 8rpx;
		margin-left: 20rpx;
}
</style>